.suggestionContainer {
	align-items: center;
	column-gap: var(--size-xSmall);
	display: flex;

	& .adminText {
		display: flex;
		flex-direction: column;

		& .email {
			color: var(--color-gray-500);
		}

		& .longValue {
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
			width: 225px;
		}
	}

	& .slackLogo {
		height: var(--size-medium);
		width: var(--size-medium);
	}

	& .slackLogoContainer {
		align-items: center;
		background: var(--color-primary-background);
		border-radius: 50%;
		box-shadow: var(--box-shadow-3);
		display: flex;
		height: calc(var(--size-medium) + var(--size-xxSmall));
		justify-content: center;
		left: calc(-1 * var(--size-xSmall));
		position: absolute;
		top: calc(-1 * var(--size-xSmall));
		width: calc(var(--size-medium) + var(--size-xxSmall));
	}

	& .avatarContainer {
		position: relative;
	}
}

.suggestionHeader {
	background: var(--color-primary-background);
	border: 1px solid var(--color-gray-300);
	border-bottom: 0;
	border-top-left-radius: var(--border-radius);
	border-top-right-radius: var(--border-radius);
	display: flex;
	height: 50px;
	justify-content: space-between;
	padding: var(--size-medium) var(--size-small);

	& p {
		font-size: 13px;
		font-weight: 400;
		margin: 0 !important;
	}
}

.noResultsMessage {
	background: var(--color-primary-background);
	border: 1px solid var(--color-gray-300);
	border-bottom-left-radius: var(--border-radius);
	border-bottom-right-radius: var(--border-radius);
	margin: 0 !important;
	max-width: 300px;
	padding: var(--size-medium) var(--size-small);
}

.commentLink {
	color: var(--color-purple);
}